<%--
  @desc: 应用列表首页
  @author: chenw
  @create: 2014-4-29 下午 15:32
--%>
<%@ page contentType="text/html;charset=utf-8" language="java"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<div class="pageHeader">
	<form rel="pageForm" onsubmit="return navTabSearch(this);"
		action="<c:url value='/monitor/vehicle'/>" method="post">
		<div class="searchBar">
			<ul>
				<li style="float: left; line-height: 25px;"><label
					style="width: 60px;">接口名称：</label> <input name="keywords"
					type="text" value="${query.keywords}" placeholder="请输入关键字检索"
					style="width: 250px; font-family: '微软雅黑 sans-serif serif';" /></li>
				<li>
					<div class="buttonActive" style="margin-left: 5px;">
						<div class="buttonContent">
							<button type="submit">查找</button>
						</div>
					</div>
				</li>
			</ul>
		</div>
	</form>
</div>
<div class="pageContent" style="padding-top: 1px;">
	<div class="panelBar">
		<ul class="toolBar">
			<li><a href="<c:url value='/monitor/view/0'/>" target="dialog"
				class="add" width="450" height="520" mask="true" resizable="false"
				maxable="false" title="新增接口"><span>新增</span></a></li>
			<li><a href="<c:url value='/monitor/del/{sel_id}'/>"
				target="ajaxDel" class="delete" title="确定要删除吗?"><span>删除</span></a></li>
			<li><a href="<c:url value='/monitor/view/{sel_id}'/>"
				target="dialog" class="edit" width="450" height="520" mask="true"
				resizable="false" maxable="false" title="编辑接口"><span>编辑</span></a></li>

			<li class="line">line</li>
			<li  style="float:right"><label style="color:red;">注：</label><img style="padding-top: 2px;" alt="监控异常" src="<c:url value='/resource/images/red.png'/>">监控异常
			<img style="padding-top: 2px;" alt="监控正常" src="<c:url value='/resource/images/green.png'/>">监控正常
			<img style="padding-top: 2px;" alt="未监控" src="<c:url value='/resource/images/grey.png'/>">未监控
			</li>
		</ul>
	</div>
	<table class="table" width="100%" layoutH="115" >
		<thead>
			<tr>
				<th width="70" align="center">当前状态</th>
				<th width="70" align="center">监控方式</th>
				<th width="70" align="center">监控间隔时间</th>
				<th width="150" align="center">接口名称</th>
				<th width="120" align="center">接口描述</th>
				<th width="120" align="center">接口地址</th>
				<th width="80" align="center">接口方式</th>
				<th width="80" align="center">请求方式</th>
				<th width="80" align="center">容错次数</th>
				<th width="370" align="center">操作</th>
				
			</tr>
		</thead>
		<tbody>
			<c:forEach var="api" items="${pager.list}" varStatus="vs">
				<tr target="sel_id"  rel="${api.id}" ondblclick="showDialog(${api.id})" >
					<td class="imgs" id="status${api.id }">
					
					<c:if test="${api.status eq 0}">
                <img src="<c:url value='/resource/images/grey.png'/>"   alt="未监控" />
                </c:if> <c:if test="${api.status eq 1}">
                <img src="<c:url value='/resource/images/green.png'/>"  alt="正常监控" />
                </c:if> <c:if test="${api.status eq -1}">
                 <img src="<c:url value='/resource/images/red.png'/>"  alt="异常监控" />
                </c:if>
					</td>
					<td><c:if test="${api.timeInterval eq 0}">
                手动监控
                </c:if> <c:if test="${!(api.timeInterval eq 0)}">
                自动监控
                </c:if></td>
					<td><c:if test="${api.timeInterval eq 0}">——</c:if> <c:if
							test="${!(api.timeInterval eq 0)}">${api.timeInterval}分钟</c:if></td>
					<td>${api.apiName}</td>
					<td>${api.apiDesc}</td>
					<td id="apiUrl">${api.url}</td>
					<td>${api.cate }</td>
					<td><c:if test="${api.isPost eq 1}">
                POST
                </c:if> <c:if test="${api.isPost eq 0}">
               GET
                </c:if> <c:if test="${api.isPost eq 2}">
               DELETE
                </c:if></td>
					<td>${api.errorNum}</td>
					<td>
						
						<div>
							<ul class="toolBar">
							 
								<li><a href="<c:url value='/monitor/record/${api.id}'/>" style="margin-right: 3px;"
									target="dialog" class="button" 
									width="720" height="520" mask="true" resizable="false"
				maxable="false"  title="接口监控"><span>监控记录</span></a></li>
								<li><a href="javascript:void()" onclick="testLink(${api.id})"
									style="margin-right: 3px;"  class="button"><span>测试连接</span></a></li>
								<li><a href="javascript:void()" onclick="stop(this,${api.id})"
									 class="button" title="编辑应用">
									 <span>
									 <c:choose>
									 	<c:when test="${api.status==0 }">启用</c:when>
									 	<c:otherwise>禁用</c:otherwise>
									 </c:choose>
									 </span></a>
									 </li> 
							</ul>
						</div>
					</td>
				</tr>
			</c:forEach>
		</tbody>
	</table>
	<div class="panelBar">
		<div class="pages">
			<span>显示&nbsp;</span> <select id="cob_ps" class="combox"
				name="numPerPage"
				onchange="navTabPageBreak({numPerPage:this.value})">
				<option value="20">20</option>
				<option value="50">50</option>
				<option value="100">100</option>
				<option value="200">200</option>
			</select> <span>条，共${pager.total}条</span>
		</div>
		<div class="pagination" targetType="navTab"
			totalCount="${pager.total}" numPerPage="${pager.numPerPage}"
			pageNumShown="10" currentPage="${pager.pageNum}"></div>
	</div>
	<form id="pagerForm" method="post"
		action="<c:url value='/monitor/vehicle'/>">
		<input type="hidden" name="pageNum" value="${pager.pageNum}" />
		<input type="hidden" name="keywords" value="${query.keywords}" /> 
		<input type="hidden" name="numPerPage" value="${pager.numPerPage}" />
		<input type="hidden" name="orderField" value="${query.orderField}" /> 
		<input type="hidden" name="orderDirection" value="${query.orderDirection}" />
		<input type="hidden" name="status" id="status" value="${api.status }" />
	</form>
</div>
<iframe  id="monitorf" name="monitorf" style="display: none"></iframe>

<script type="text/javascript">

function testLink(id){
	$.ajax({
        url: "<c:url value='/monitor/test/"+id+"'/>",
        timeout : 5000,
        success: function (resp) {
        	//var re = eval("(" + resp + ")");
 		//	var jsonobj=eval('('+resp+')');  
         	 alertMsg.info(resp.msg + "!");
          //	alertMsg.info(jsonobj.msg + "!");
        },
        error:function(data){
        //	alert("连接超时...");
        }
    }); 
}

function stop(obj,id){
	var status = 0;
	//alert();
	if($.trim($(obj).find("span").html()) == "禁用"){
		status = 0;
		
		//$("#status"+id).html(status);
		$(obj).find("span").html("启用");
	}else{
		status = 1;
		//$("#status"+id).html(status);
		$(obj).find("span").html("禁用");
	}
	var url = "<c:url value='/monitor/updateStatus'/>";
    $.ajax({
        url: url,
        type:'post',
       //async:false, 
        data:"id="+id+"&status="+status,
        success: function (resp) {
        	alertMsg.info(resp.msg + "!");
        	navTab.reloadFlag("page_sys_vehicle");
        },
        error:function(data){
        //	alert("连接超时...");
        }
    }); 
}

function showDialog(apiid){
	$.pdialog.open("<c:url value='/monitor/DBview/"+apiid+"'/>","pid","查看明细",
			
				{ maxable:false, mask:true, width: 450, height: 520,resizable :false});
}

function test(id)
{
	//monitorf.location.replace("http://172.16.1.220:8078/econsole/monitortask/startMonitor?id="+id );
	monitorf.location.replace("http://localhost:8080/econsole/monitortask/startMonitor?id="+id );
}

function test2(id)
{
//	monitorf.location.replace("http://172.16.1.220:8078/econsole/monitortask/updateMonitor?id="+id );
	monitorf.location.replace("http://localhost:8080/econsole/monitortask/updateMonitor?id="+id );
}

</script>
